<template>
	<view class="layout">
		<view class="textbox">
			<textarea name="txt" id="" cols="30" rows="10" :auto-height="true" :value="inputtext"></textarea>
		</view>	
		<!-- #ifdef MP -->	
		<view class="audio" v-if="audiofile.length">
			<audio style="text-align: left" :src="audiofile" controls="true"></audio>
		</view>

		<button :disabled="isRecording" @click="startRecording">开始录音</button>
		<button :disabled="!isRecording" @click="stopRecording">停止录音</button>		
		<button :disabled="!audiofile.length" @click="up2Asr">声音识别</button>
		
		<view class="asrresult">
			<textarea :auto-height="true" class="return" :value="asc_res" :disabled="true"></textarea>
		</view>
		<!-- #endif -->		

	</view>
</template>

<script setup>
import {ref,computed} from "vue"
import { pathToBase64, base64ToPath } from 'image-tools'
import {
	onLoad,onShareAppMessage,onShareTimeline
} from "@dcloudio/uni-app"
const inputtext = ref("一二三四五, 金木水火土。天地分上下, 日月照今古。")
<!-- #ifdef MP -->
const isRecording = ref(false)
const startTimestamp = ref(null)
const endTimestamp = ref(null)
const duration = ref(0)
const recordingTime = ref("aaa")
const audiofile = ref("")
const asc_res = ref("")
const server_token = ref("db140af0-c1b8-11ee-b115-0242ac110003")
const recorderManager = uni.getRecorderManager();
const innerAudioContext = uni.createInnerAudioContext();
const fileSystemManager = uni.getFileSystemManager();
innerAudioContext.autoplay = true;
//const recorderManager = uni.getRecorderManager();
// const innerAudioContext = uni.createInnerAudioContext();
// innerAudioContext.autoplay = true;
onLoad(async (e) => {
	recorderManager.onStop(function (res) {
	//console.log("录音完成", res.tempFilePath); 
	
	innerAudioContext.src = res.tempFilePath;
	innerAudioContext.play();	
	audiofile.value = res.tempFilePath
						
	})
})
	
const startRecording=()=>{
	isRecording.value = true
	recorderManager.start({
		                format:"mp3",
						duration: 60000,		// 录音持续时间最长60秒
						sampleRate: 16000,		// 采样率 16000 说话录音足够了
						numberOfChannels: 1		// 单声道
					});
}

const stopRecording=()=>{
	//console.log("button stopRecording!")
	recorderManager.stop();
	isRecording.value = false
}

const up2Asr=()=>{
	const tempFilePaths = audiofile.value;
	pathToBase64(tempFilePaths)
		.then(base64 => {
			//console.log(server_url_api_name.value)
			let base64String = base64.substring(base64.indexOf(',') + 1)
			//console.log('base64String', base64String)
			//file_base64.value = base64String
			uni.request({
				url:"https://rd.aitestgo.com/run/paddleAsr",
				//url:"http://59.110.163.32:50052/run/paddleAsr",
				//url:"http://172.16.75.68:9012/run/paddleAsr",
				data:{
					"data":[
						server_token.value,
						{
						"data":"data:@file/octet-stream;base64,"+base64String,
						"name":"p1.wav",
						//"size":351604,
					}]},									
				method:"POST",
				success:res=>{
					if (res.data.data[0].hasOwnProperty("result")){
						asc_res.value = res.data.data[0]["result"]
					}
					//let newShowHeight = res.data.data[0]["height"]*750/res.data.data[0]["width"]
					//imageStyle.height = `${newShowHeight}rpx`;
					//console.log("image_width:", res.data.data[0]["width"])
					//console.log("image_height:", res.data.data[0]["height"])										
				}
			})
		})
		.catch(error => {
			console.error(error)
		})
}
<!-- #endif -->		
</script>

<style lang="scss" scoped>
.layout{
	.textbox{
		width: 100%;
		height: auto;
		white-space: normal;
		background-color: #defffe;
		textarea{
			font-size: 26px;
		}
	}
	.asrresult{
		width: 750rpx;
		textarea{
			width: 100%;
			color:seagreen;
			font-size:20px;
			font-weight: bold;
		}
	}
}
</style>
